/*----------------layout--------------*/
[v-cloak] {
    display: none;
}
html,body,#app_body,.el-container{
    height: 100%;
}
body {
    margin: 0;
    padding: 0;
    font-size: 12px;
}
a {
    text-decoration: none !important;
    color: #fff
}
li {
    list-style: none;
}

.f-12 {
    font-size: 12px;
}
.f-14 {
    font-size: 14px;
}
.f-16 {
    font-size: 16px;
}
.f-18 {
    font-size: 18px;
}
.ml-5 {
    margin-left: 5px;
}
.ml-10 {
    margin-left: 10px;
}
.ml-15 {
    margin-left: 15px;
}
.ml-20 {
    margin-left: 20px;
}
.ml-25 {
    margin-left: 25px;
}
.mr-5 {
    margin-right: 5px;
}
.mr-10 {
    margin-right: 10px;
}
.mr-15 {
    margin-right: 15px;
}
.mr-20 {
    margin-right: 20px;
}
.w-half {
    width: 50%;
}

.left {
    float: left;
}
.right {
    float: right;
}

.el-button+.el-button {
    margin-left: 2px;
}

.el-input__inner {
    padding: 0 15px 0 10px;
}
.el-input--suffix .el-input__inner {
    padding-right: 25px;
}

.round {
    border-radius:50%
}
.size-L {
    width: 80px;
}
.avatar {
    display: inline-block;
}

/*******************************************Header******************************************/

.el-header {
    background-color: #3c8dbc;
    color: #fff;
    height: 50px !important;
    line-height: 50px;
    padding: 0;
    margin: 0;
    position: relative;
}
.el-header .logo {
    width: 200px ;
    padding: 0 15px;
    text-align: center;
    font-size: 20px;
    display: inline-block;
}

.el-header .menu {
    position: absolute;
    display: inline-block;
}
.el-header .menu:hover {
    background: #367fa9;
    cursor: pointer;
}
.el-header .menu a {
    text-decoration: none;
    padding:0 12px;
}

.el-header .userbar {
    display: inline-block;
    position: absolute;
    right: 0;
}
.el-header .userbar ul {
    padding: 0;
    margin: 0;
}
.el-header .userbar ul li {
    float: left;
    cursor: pointer;
}
.el-header .userbar ul li:hover {
    background: #367fa9;
}
.el-header .userbar ul li a{
    padding: 0 10px;
}
.el-header .userbar ul .user {
    position: relative;
    padding: 0 10px 0 40px;
}
.el-header .userbar ul li img {
    width: 24px;
    border-radius: 25px;
    position: absolute;
    top: 13px;
    left: 10px;
}
.el-header .user-info {
    width: 260px;
    margin-top: 1px;
    background: #3c8dbc;
    position: absolute;
    right: 0;
    display: none;
    z-index: 999;
}
.el-header .user-info .user-header {
    padding: 0 2px;
    font-weight: 200;
}
.el-header .user-info .user-header dl {
    margin: 10px;
}
.el-header .user-info .user-header dl dt {
    height: 28px;
    line-height: 28px;
}
.el-header .user-info .user-header dl dd {
    margin: 0;
    height: 28px;
    line-height: 28px;
}
.el-header .user-info .user-header dl dd .w-half{
    display: inline-block;
}
.el-header .user-info .user-footer {
    margin: 0 2px;
    line-height: 30px;
    border-top: 1px solid #fff;
    opacity:0.8;
}
.el-header .el-icon-third-logout:before {
    font-size: 12px;
}
.el-header .user-footer .el-icon-third-person:before {
    font-size: 12px;
}

/*******************************************Aside******************************************/

.el-aside {
    height: calc(100% - 50px);
    height: -moz-calc(100% - 50px);
    height: -webkit-calc(100% - 50px);
    width: 230px !important;
    position: relative;
    background: #222d32 !important;
}
.el-menu-vertical-demo:not(.el-menu--collapse) {
    width: 230px;
}
.el-menu {
    background: #222d32 !important;
    text-decoration-line: none;
}
.el-submenu__title,.el-menu-item {
    height: 40px;
    line-height: 40px;
    font-size: 12px;
    padding: 0 15px !important;
}
.el-menu-item , .el-submenu__title {
    color: #b8c7ce !important;
}
.el-menu-item.is-active {
    color: #fff !important;
    background: #1e282c !important;
    border-left: 3px solid #3c8dbc;
    padding-left: 12px !important;
}
.el-submenu__title:hover, .el-menu-item:hover {
    color: #fff !important;
    background: #1e282c !important;
    border-left: 3px solid #3c8dbc;
    padding-left: 12px !important;
}
.el-submenu__title i, .el-menu-item i {
    font-size: 12px !important;
}
.el-tooltip {
    padding: 0 15px !important;
}
.el-submenu ul li {
    color: #8aa4af !important;
    background: #2c3b41 !important;
    padding-left: 30px !important;
    height: 40px !important;
    line-height: 40px !important;
}
.el-submenu ul li:hover, .el-submenu ul .is-active {
    color: #fff !important;
    background: #2c3b41 !important;
    padding-left: 27px !important;
}
.el-aside .demo-input-suffix {
    height: 50px;
    line-height: 50px;
    text-align: center;
    margin-bottom: 3px;
}
.el-aside .demo-input-suffix .el-input__inner {
    width: 200px;
    background: #2c3b41;
    border: 0;
}

/*******************************************Main******************************************/

.el-main {
    width: calc(100% - 230px) !important;
    width: -moz-calc(100% - 230px) !important;
    width: -webkit-calc(100% - 230px) !important;
    height: calc(100% - 50px) !important;
    height: -moz-calc(100% - 50px) !important;
    height: -webkit-calc(100% - 50px) !important;
    padding: 15px ;
    color: #333;
    background: #f1f4f6;
    border-color: #e8edf0;
    position: absolute;
    top: 50px;
    left: 230px;
}
.el-main .panel-nav {
    margin-bottom: 15px;
}
.el-main .el-breadcrumb {
    font-size: 12px;
    overflow: hidden;
}
.el-main .el-breadcrumb__separator {
    margin: 0 5px;
    font-weight: 500;
}
.el-main .panel-desc {
    padding: 15px;
    background: #e8edf0;
    line-height: 20px;
}
.el-main .panel-desc .tips {
    margin-left: 25px;
}
.el-main .panel-main {
    padding: 15px;
    background: #fff;
}
.el-main .panel-main .el-button--mini, .el-button--mini.is-round {
    padding: 7px 8px;
}
.el-main .panel-main .main-search{
    display: none;
    margin-bottom: 15px;
}
.el-main .panel-main .main-header{

}
.el-main .panel-main .main-header .el-input {
    width: 200px;
    float: right;
}
.el-main .panel-main .main-header .el-input .el-input__suffix {
    right: 5px;
}
.el-main .panel-main .main-body {
    margin-top: 5px;
}

/*******************************************滚动条******************************************/

.el-autocomplete-suggestion__wrap.el-scrollbar__wrap {
    margin: 0 !important;
    overflow-y: auto;
}
.el-scrollbar{
    height: 100%;
}
.el-scrollbar__wrap{
    overflow-x:auto;
    margin-right: -18px !important;
}

/*******************************************Table******************************************/

.el-table, .el-form-item__label, .el-form-item__content {
    font-size: 12px !important;
}
.el-table td, .el-table th {
    padding: 8px 0;
}
.el-table .el-table__expanded-cell {
    padding: 10px 15px;
}
.el-table .demo-table-expand label {
    width: 100px;
}
.el-table .el-form-item__label {
    padding: 0 20px 0 0;
    text-align: right;
}
.el-table .demo-table-expand {
    font-size: 0;
}
.el-table .demo-table-expand label {
    width: 90px;
    color: #99a9bf;
}
.el-table .demo-table-expand .el-form-item {
    margin-right: 0;
    margin-bottom: 0;
    width: 50%;
}
.el-table .demo-table-expand .el-form-item.opt {
    width: 100%;
}
.el-table .el-table__row .el-button.el-button--text.el-button--mini {
    padding: 5px 2px;
}
.el-table .el-table__row .el-button .el-icon-third-repwd {
    font-size: 14px;
}
.el-table .el-button .el-icon-third-submit {
    font-size: 12px;
}

/*******************************************cascader******************************************/

.el-cascader-menu {
    max-height: 180px;
}
.el-cascader-menus .el-cascader__label {
    padding: 0 25px 0 10px;
}
.el-cascader-menus .el-cascader-menu__item {
    font-size: 12px;
    padding: 5px 15px;
    height: 28px;
}

/*******************************************message******************************************/

.el-message-box {
    width: 280px;
}
.el-message-box .el-message-box__header {
    padding: 15px 15px 0px;
}
.el-message-box .el-message-box__header .el-message-box__title {
    font-size: 16px;
}
.el-message-box .el-message-box__content {
    font-size: 12px;
    padding: 10px 15px 5px;
}
.el-message-box .el-message-box__content .el-message-box__status.el-icon-warning {
    font-size: 20px!important;
}
.el-message-box .el-message-box__btns {
    padding: 0 15px;
}
.el-message-box .el-message-box__btns .el-button--small, .el-button--small.is-round {
    padding: 6px 10px;
}

/*******************************************ucenter******************************************/

.show-header {
    padding: 15px;
    background: #3b9dbc;
    line-height: 0;
    color: #fff;
    font-weight: 300;
}
.show-header .avatar {
    margin-right: 15px;
}
.show-header dl {
    vertical-align: top;
    display: inline-block;
    padding: 5px 0;
    margin: 0;
    width: calc(100% - 100px);
}
.show-header dl dt{
    line-height: 20px;
}
.show-header dl dd{
    line-height: 20px;
}
.show-body {
    min-height: 100px;
}

/*******************************************tabs******************************************/

.el-tabs.el-tabs--card {
    padding: 0 5px;
}
.el-tabs.el-tabs--card .el-tabs__header {
    line-height: 0;
    margin-top: 10px;
}
.el-tabs.el-tabs--card .el-tabs__header .el-tabs__item {
    font-size: 12px;
    padding: 0 10px;
    height: 30px;
    line-height: 30px;
    font-weight: 400;
}
.el-tabs.el-tabs--card .el-tabs__header .el-tabs__item:nth-child(2) {
    padding-left: 10px;
}
.el-tabs.el-tabs--card .el-tabs__header .el-tabs__item:last-child {
    padding-right: 10px;
}

.el-tabs .el-tabs__header .el-tabs__nav-next {
    right: 5px;
    line-height: 30px;
}
.el-tabs .el-tabs__header .el-tabs__nav-prev {
    left: 5px;
    line-height: 30px;
}

/*******************************************layer******************************************/

.layui-layer .layui-layer-title {
    height: 32px;
    line-height: 32px;
    font-size: 12px;
}
.layui-layer .layui-layer-setwin {
    top: 8px;
}
.layui-layer .layui-layer-setwin a {
    width: 14px;
    height: 14px;
}
